
// mixins +++
.thm-linear-gradient-mixin(@start, @end) when (iscolor(@start)) and (iscolor(@end)) {
	background-color: mix(@start, @end, 60%) !important;
    background-image: -moz-linear-gradient(top, @start, @end) !important; // FF 3.6+
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@start), to(@end)) !important; // Safari 4+, Chrome 2+
    background-image: -webkit-linear-gradient(top, @start, @end) !important; // Safari 5.1+, Chrome 10+
    background-image: -o-linear-gradient(top, @start, @end !important); // Opera 11.10
    background-image: linear-gradient(to bottom, @start, @end) !important; // Standard, IE10
    background-repeat: repeat-x !important;
    filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start),argb(@end))) !important; // IE9 and down
}

.thm-border-radius(@radius) when (ispixel(@radius)) {
  -webkit-border-radius: @radius !important;
     -moz-border-radius: @radius !important;
          border-radius: @radius !important;
}

.thm-box-shadow(@shadow) {
  -webkit-box-shadow: @shadow !important;
     -moz-box-shadow: @shadow !important;
          box-shadow: @shadow !important;
}
.thm-body-background-image(@value) when (isstring(@value)) {
	background-image: url("@{base}@{value}") !important;
}
.thm-body-background-image(@value) when not (isstring(@value)) {
	background-image: @value !important;
}
.thm-rgba-background-color(@simple, @rgba) when (@rgba = false) {
	background-color: @simple !important;
}
.thm-rgba-background-color(@simple, @rgba) when not (@rgba = false) {
	background-color: @simple !important;
	background-color: @rgba !important;
}
// --- mixins

.thm-body {
	color: @main-color;
	background-color: @main-background-color;
	background-size: @main-background-size;
	.thm-body-background-image(@main-background-image);
}

.thm-loading {
	color: @loading-color !important;
	text-shadow: @loading-text-shadow !important;

	.e-spinner .e-bounce {
		background-color: @loading-color !important;
	}
}

.thm-login-desc .desc {
	color: @loading-color !important;
	text-shadow: @loading-text-shadow !important;
}

.thm-login {
	border: @login-border !important;
	.thm-rgba-background-color(@login-background-color, @login-rgba-background-color);
	.thm-linear-gradient-mixin(@login-gradient-start, @login-gradient-end);
	.thm-border-radius(@login-border-radius);
	.thm-box-shadow(@login-box-shadow);
}

.thm-login-text {
	color: @login-color !important;

	.legend, .e-checkbox-icon, .g-ui-link, .social-button, .language-button {
		color: @login-color !important;
	}
}

.thm-powered, .thm-mobile-switcher {
	color: @powered-color;
	a {
		color: @powered-color;
		&:hover {
			color: lighten(@powered-color, 20%);
		}
	}
}

.thm-languages {
	color: @languages-color;
	.flag-name {
		color: @languages-color;
		border-color: @languages-color;
	}
}

.g-ui-menu {
	color: @dropdown-menu-color !important;
	background-color: @dropdown-menu-background-color !important;
}

.g-ui-menu .e-item > .e-link {
	color: @dropdown-menu-color !important;
	background-color: @dropdown-menu-background-color !important;

	> i {
		color: @dropdown-menu-color !important;
	}
}

.g-ui-menu .e-item.selected > .e-link {
	background-color: @dropdown-menu-selected-background-color !important;
}

.g-ui-menu .e-item > .e-link:hover, .g-ui-menu .e-item > .e-link:focus {
	color: @dropdown-menu-hover-color !important;
	background-color: @dropdown-menu-hover-background-color !important;

	> i {
		color: @dropdown-menu-hover-color !important;
	}
}

.g-ui-menu .e-item.disabled > .e-link, .g-ui-menu .e-item.disabled > .e-link:hover {
	color: @dropdown-menu-disabled-color !important;
	background-color: @dropdown-menu-background-color !important;

	> i {
		color: @dropdown-menu-disabled-color !important;
	}
}

.thm-message-list-top-toolbar, .thm-message-list-bottom-toolbar {
	.thm-rgba-background-color(@message-list-toolbar-background-color, @message-list-toolbar-rgba-background-color);
	.thm-linear-gradient-mixin(@message-list-toolbar-gradient-start, @message-list-toolbar-gradient-end);
}

.thm-folders .e-link {

	color: @folders-disabled-color !important;

	&.selectable {
		color: @folders-color !important;
	}

	&.selectable:hover {
		color: @folders-hover-color !important;
		.thm-rgba-background-color(@folders-hover-background-color, @folders-hover-rgba-background-color);
	}

	&.selectable.selected {
		color: @folders-selected-color !important;
		.thm-rgba-background-color(@folders-selected-background-color, @folders-selected-rgba-background-color);
	}

	&.focused {
		color: @folders-focused-color !important;
		.thm-rgba-background-color(@folders-focused-background-color, @folders-focused-rgba-background-color);
	}

	&.selectable.droppableHover {
		color: @folders-drop-color !important;
		.thm-rgba-background-color(@folders-drop-background-color, @folders-drop-rgba-background-color);
	}
}

.thm-settings-menu .e-item {

	.e-link {
		color: @settings-menu-disabled-color !important;
	}

	&.selectable .e-link {
		color: @settings-menu-color !important;
	}

	&.selectable:hover .e-link {
		.thm-rgba-background-color(@settings-menu-hover-background-color, @settings-menu-hover-rgba-background-color);
		color: @settings-menu-hover-color !important;
	}

	&.selectable.selected .e-link {
		.thm-rgba-background-color(@settings-menu-selected-background-color, @settings-menu-selected-rgba-background-color);
		color: @settings-menu-selected-color !important;
	}
}

.thm-message-view-background-color {
	.thm-rgba-background-color(@message-background-color, @message-rgba-background-color);
}


html.no-css {

	.thm-body {
		color: #333;
		background-color: #aaa;
		background-image: none;
	}

	.thm-loading {
		color: #333 !important;
		text-shadow: none !important;

		.e-spinner .e-bounce {
			display: none !important;
		}
	}

	.thm-login-desc .desc {
		color: #333 !important;
		text-shadow: none !important;
	}
}